<!-- 人员信息管理详情 -->
<script>
import bus from "@/eventBus";
import InterviewDetailLeftNav from "@/components/detailCommons/interviewDetailLeftNav";
import PeopleBasicInfo from "@/components/detailCommons/PeopleBasicInfo";
import PeopleSelfInfo from "@/components/detailCommons/PeopleSelfInfo";
import PeoplePayInfo from "@/components/detailCommons/PeoplePayInfo";
import { fetchPeopleInfoDetail, outsourcerExport } from "@/fetch/modules/peopleInfo";
import { getArrangeDetilInfo } from "@/fetch/modules/arrange";
import { findAdmitField } from "@/fetch/modules/ectrance";
import { toThousands } from "@/utils/numberFormat";
import { loadToExclxPlu } from "@/utils/exportDatas";

// function fetchPeopleDetailInfo(store, opts) {
//   return store.dispatch("FETCH_PEOPLE_DETAIL", opts);
// }
export default {
  components: {
    InterviewDetailLeftNav,
    PeopleSelfInfo,
    PeoplePayInfo,
    PeopleBasicInfo,
  },
  data() {
    return {
      userInfo: {
        name: "",
        ex: "",
        zz: "",
        cvdbId: "",
      },
      navs: [
        {
          lable: "基本信息",
          id: "1",
          val: "basic",
          isActive: true,
        },
      ],
      nominateInfo: {},
      candidateData: {
        name: "",
        record: "",
        handsOn: "",
        isInJob: "",
        comeTime: "",
        phone: "",
        desc: "",
      },
      basicInfo: {},
      selfInfo: {},
      salaryInfo: {},
      areas: {}, // 区号
      idtypes: {}, // 证件类型
      zzgzdds: {}, // 城市
      workTimeTypeMap: {},
      outsourceTypeMap: {}
    };
  },
  created() {
    this.findAdmitField();
  },
  beforeMount() {
    let { id } = this.$route.params;
    let { stus, nId } = this.$route.query;
    this.needId = id;
    this.state = stus;
    if (nId) {
      // * 当存在needsId， 获取左边简历信息
      this.fetchDetailData(nId);
    } else {
      // * 当不存在needsId, 从存储取
      this.setStockUserInfo();
    }
  },
  mounted() {
    bus.$on("select-tab", this.selectPeopleTabItem);
  },
  methods: {
    // * 获取详情数据
    fetchDetailData(needsId) {
      getArrangeDetilInfo({ needsId }).then((res) => {
        const { state, data } = res.data;
        if (state === "0000") {
          this.userInfo = {
            ...data.cvdbInfo,
            name: data.cvdbInfo.surname,
            ex: data.needsDetails.positionName,
            zz: data.cvdbInfo.file_url,
          };
        }
      });
    },
    // * 存量数据情况下，根据列表带入展示
    setStockUserInfo() {
      const _info = this.$store.state.info;
      this.userInfo.name = _info.userName;
      this.userInfo.ex = _info.positionName;
    },
    async fetchPeopleInfoDetail(id, settlementMethod) {
      console.log(id)
      if(!id) return
      const { data } = await fetchPeopleInfoDetail({ id });
      console.log(data);
      if (data.state === "0000" && data.data) {
        const {
          workingPlaceStr,
          reportingPlaceStr,
          sex,
          certificateTypeCode,
          areaCode,
          bhrAccount,
          oaAccount,
          flowAccount,
          accountMatching,
          admitTime,
          monthly,
          workTimeType,
          outsourceType,
        } = data.data || {};
        let sexArr = ["女", "男"];
        let startArr = ["未开启", "已开启"];
        let tempObj = {
          ...data.data,
          workingPlace: workingPlaceStr,
          reportingPlace: reportingPlaceStr,
          sex: sexArr[sex],
          certificateTypeCode:
            certificateTypeCode && this.idtypes[certificateTypeCode],
          areaCode: areaCode && `+ ${this.areas[areaCode]}`,
          bhrAccount: bhrAccount && startArr[bhrAccount],
          oaAccount: oaAccount && startArr[bhrAccount],
          flowAccount: flowAccount && ["未添加", "已添加"][flowAccount],
          accountMatching: accountMatching && startArr[accountMatching],
          admitTime: admitTime && admitTime.split(" ")[0],
          monthly: monthly && toThousands(monthly),
          settlementMethod,
          workTimeType: this.workTimeTypeMap[workTimeType],
          outsourceType: this.outsourceTypeMap[outsourceType],
        };
        this.basicInfo = tempObj;
      }
    },
    findAdmitField() {
      const { nId, sn, wc } = this.$route.query || {};
      findAdmitField({ needsCvId: nId, surName: sn, workCode: wc }).then(
        (res) => {
          const data = res.data;
          if (data.state === "0000") {
            this.areas = {};
            this.idtypes = {};
            this.zzgzdds = {};
            const { areas, idtypes, zzgzdds, clearingFormVO, workTimeTypeMap, outsourceTypeMap } = data.data;
            for (let key in areas) {
              this.areas[key] = areas[key];
            }
            for (let key in idtypes) {
              this.idtypes[key] = idtypes[key];
            }
            for (let key in zzgzdds) {
              this.zzgzdds[key] = zzgzdds[key];
            }

            this.workTimeTypeMap = workTimeTypeMap
            this.outsourceTypeMap = outsourceTypeMap

            let { id } = this.$route.params;

            this.fetchPeopleInfoDetail(id, clearingFormVO.settName);
          }
        }
      );
    },
    selectPeopleTabItem(type) {
      _j("[mode-type=" + type + "]")
        .siblings(".module-box")
        .removeClass("is-active-tab");
      _j("[mode-type=" + type + "]").addClass("is-active-tab");
    },
    // * 导出
    async onExportData() {
      const { wc } = this.$route.query;
      const { data } = await outsourcerExport({
        workCode: wc,
        export: true
      });
      if (data.state === "0000") {
        const { list, head, title } = data.data || {};
        loadToExclxPlu(this, head, list, title);
      }
    },
  },
  beforeDestroy() {
    bus.$off("select-tab", this.selectPeopleTabItem);
  },
};
</script>

<template>
  <ul class="interview-common-detail">
    <!-- <li class="resume-detail-left">
      <InterviewDetailLeftNav
        :jobTip="'岗位名称'"
        :isShowGroomBox="false"
        :userInfo="userInfo"
        :navs="navs"
        :nominateInfo="nominateInfo"
      ></InterviewDetailLeftNav>
    </li> -->
    <li class="resume-detail-right">
      <div class="buttons">
        <el-button type="primary" @click="onExportData">导出</el-button>
        <backButton :backPath="'/peopleinfo'"></backButton>
      </div>
      <div class="module-box is-active-tab" v-bind:mode-type="'basic'">
        <PeopleBasicInfo :candidateInfo="basicInfo"></PeopleBasicInfo>
      </div>
      <div class="module-box" v-bind:mode-type="'selfInfo'">
        <PeopleSelfInfo :candidateInfo="selfInfo"></PeopleSelfInfo>
      </div>
      <div class="module-box" v-bind:mode-type="'payInfo'">
        <PeoplePayInfo :candidateInfo="salaryInfo"></PeoplePayInfo>
      </div>
    </li>
  </ul>
</template>

<style lang="scss">
@import "~@/assets/scss/mixins.scss";
@include Interview-detail;

.buttons {
  position: absolute;
  top: 20px;
  right: 20px;
  display: flex;
  width: 120px;
  align-items: center;
  justify-content: center;
  .back-button {
    position: relative;
    top: 0 !important;
    right: 0 !important;
  }
  >div {
    flex: 1;
  }
}
</style>
